<template>
  <!-- 城市学历列表 -->
  <table class="barChart">
    <tr class="head">
      <th>
      排名
    </th>
      <th>城市</th>
      <th>薪资(K/月)</th>
    </tr>
    <tr class="list" v-for="(item,index) in data" :key="index">
      <td style="text-align:center">
        {{index+1}}</td>
      <td>{{item.location}}</td>
      <td>{{item.salary}}</td>
    </tr>
  </table>
</template>

<script>
import { getCitySalaryXueli } from "@/api/page2Api";
export default {
  name: "",
  data() {
    return {
      data: [],
    };
  },
    props: {
        type: Number,
    },
  methods: {
    setChart() {},
  },
  mounted() {
    getCitySalaryXueli().then((res1) => {
      let res = res1.data
      this.data = res[this.type];
    });
  },
};
</script>

<style lang="less" scoped>
.barChart {
    padding-top: 10px;
  width: 100%;
  height: 100%;
//   background: skyblue;
  .list {
    td {
        color: #fff;
        &:first-child{
            text-align:center
        }
        &:last-child{
            text-align: center;
        }
    }
  }
  .head {
    // background: red;
    line-height: 5px;
    color: #6EDDF1;
    th {
        min-width: 20%;
        width: 20px;
    }
  }
}
</style>